<template>
<!-- 健康评估 -->
    <div>
        <div class="frist_show">
            <el-breadcrumb separator-class="el-icon-arrow-right">
              <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
              <el-breadcrumb-item :to="{ path: '/assess' }">评估测评</el-breadcrumb-item>
              <el-breadcrumb-item :to="{ path: '/evaluate/' + this.$route.params.rid + '/' + this.$route.params.rname}">{{this.$route.params.rname}}</el-breadcrumb-item>
              <el-breadcrumb-item >{{this.$route.params.rname}}问卷</el-breadcrumb-item>
            </el-breadcrumb>
            <el-divider></el-divider>
        </div>
        <!-- 评估类型 -->
        <div class="pgtype">
           <div class="asstype"  v-for="item in Asslist" :key="item.quesId" @click="QuetionWj(item.quesId)">
             <div style="text-align:center;">
                <svg class="icon myIcomwj" aria-hidden="true">
                  <use></use>
                </svg>
                <p>{{item.quesName}}</p>
             </div>
           </div>
        </div>
    </div>
</template>

<script>
export default {
  name: 'Assessment',
  data () {
    return {
      rval: this.$route.params.rval,
      rid: this.$route.params.rid,
      rname: this.$route.params.rname,
      ling: 0,
      Asslist: []
    }
  },
  methods: {
    initQuestion () {
      this.$axios.post(`/api/QuestionPg/${this.rval}`).then(result => {
        result.data.forEach((item, index) => {
          this.Asslist.push(item)
        })
      })
    },

    // 开始答题
    QuetionWj (quetid) {
      this.$router.push('/quetion/' + this.rid + '/' + this.rval + '/' + this.rname + '/' + quetid)
    }
  },
  created () {
    this.initQuestion()
  }
}
</script>

<style>
.icon{width: 1em;height: 1em;vertical-align: -0.15em;fill: currentColor;overflow: hidden;}
.myIcomwj{font-size: 50px;}
.frist_show{position: absolute;top: 0px;left:20px;width: 1500px;height: 50px;}
.frist_show .el-breadcrumb{margin-top: 15px;}
.asstype{margin-bottom: 80px; width: 1430px;height: 150px; background-color: darkgrey; border-radius: 8px;cursor: pointer;}
.asstype p{font-size: 30px;}
.asstype svg{margin-top: 14px;}
.pgtype{position: absolute;top: 100px;left:50px;width:1440px;height:500px;}
</style>
